// Styles for buttons and actions.
.nx-page .button,
.nx-page a.button,
.nx-page input.button,
.nx-page .action_bar a,
.nx-page button,
.nx-page input[type="reset"],
.nx-page input[type="submit"],
.nx-page input[type="button"] {
  background: none $shade-light-0;
  border: 1px solid $shade-medium-20;
  border-radius: $common-radius;
  color: $font-color;
  cursor: pointer;
  display: inline-block;
  font-size: 12px;
  font-weight: bold;
  height: 30px;
  letter-spacing: .05rem;
  line-height: 30px;
  margin: 0 .5rem .5rem 0;
  padding: 0 1.1em;
  text-align: center;
  text-decoration: none;
  transition: all 300ms ease 0s;
  white-space: nowrap;
}

.nx-page .button:hover,
.nx-page a.button:hover,
.nx-page input.button:hover,
.nx-page .action_bar a:hover,
.nx-page button:hover,
.nx-page input[type="reset"]:hover,
.nx-page input[type="submit"]:hover,
.nx-page input[type="button"]:hover {
  background: none $shade-light-0;
  border-color: $shade-strong-20;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .2);
  transition: all 150ms ease-in-out 0s;
}

.nx-page .button:focus,
.nx-page button:focus,
.nx-page input[type="reset"]:focus,
.nx-page input[type="submit"]:focus,
.nx-page input[type="button"]:focus {
  border-color: $button-focus;
  box-shadow: 0 0 3px #b5dcff;
  outline: none;
}

.nx-page button.disabled,
.nx-page input.disabled,
.nx-page button.disabled:hover,
.nx-page input.disabled:hover,
.nx-page .button[disabled],
.nx-page .button[disabled]:hover,
.nx-page .button[disabled=disabled],
.nx-page .button[disabled=disabled]:hover,
.nx-page button:disabled,
.nx-page button:disabled:hover,
.nx-page input[type="reset"]:disabled,
.nx-page input[type="reset"]:disabled:hover,
.nx-page input[type="submit"]:disabled,
.nx-page input[type="submit"]:disabled:hover,
.nx-page input[type="button"]:disabled,
.nx-page input[type="button"]:disabled:hover {
  background: none rgba(255, 255, 255, .8);
  border-color: $shade-light-30;
  box-shadow: none;
  cursor: not-allowed;
  display: none;
}

.nx-page .tinyButton,
.nx-page .smallButton,
.nx-page a.tinyButton,
.nx-page a.smallButton,
.nx-page input.tinyButton,
.nx-page input.smallButton {
  font-size: .9em;
  padding: 0 .5em;
  height: 2.5em;
  line-height: 2.5em;
  text-decoration: none;
}

.nx-page .tinyButton,
.nx-page a.tinyButton,
.nx-page input.tinyButton {
  font-size: .85em;
  padding: 0 .3em;
}

.nx-page .button .smallIcon {
  vertical-align: text-bottom;
}

.nx-page .dropdown,
.nx-page .dropdown:hover {
  background: url('${basePath}/icons/dropdown.png') no-repeat scroll right center;
  background-color: $shade-light-0;
  letter-spacing: .05px;
  line-height: 130%;
  padding: .4em 1.5em .43em .8em;
  text-transform: none;
}

// =Action Bar
.action_bar {
  float: left;
  line-height: normal;
  margin: .5em .5em .8em 0;
}

.action_bar a img {
  margin: 0 .5em 0 0;
  vertical-align: text-bottom;
}

.action_bar_message {
  float: right;
  font-size: .8em;
  margin: 0;
}

.action_bar_message form {
  display: inline;
  text-align: right;
}

.action_bar ul {
  list-style: none;
  margin: 0;
  padding: 0 1em 0 0;
}

.action_bar li {
  float: left;
  margin: 0;
  padding: 0;
}

.nx-page.action_bar a {
  float: left;
  font-size: .9em;
  font-weight: bold;
  margin: 0 .6em .7em 0;
  padding: .3em .7em .4em;
  text-decoration:none;
}

.nx-page.action_bar a img {
  float: left;
  margin: -.2em .3em -.3em -.4em;
}

.nx-page .action_bar input[type="text"] {
  margin: 0 .2em;
  padding: .3em .5em;
  width: auto;
}

.nx-page.action_bar input.button {
  margin-top: 0;
}

.nx-page.contentViewQuickFilterForm .action_bar a {
  margin: 0;
}

.contentViewUpperActions {
  color: $shade-strong-20;
  float: right;
  font-size: .9em;
  line-height: normal;
  margin: .8em 0;
  text-align: right;
}

.contentViewUpperActions .actionsWidgetPanel {
  padding: 0;
}

.contentViewUpperAction img {
  max-height: 16px;
  max-width: 16px;
}

.contentViewUpperAction {
  display: inline-block;
  padding: 0 0 0 .1em;
  vertical-align: top;
}

.contentViewUpperAction .widgetPanel,
.contentViewUpperAction .actionsWidgetPanel {
  display: inline-block;
  padding: 0;
}

.nx-page.contentViewUpperAction a {
  color: $shade-medium-10;
  font-size: .85em;
}

.contentViewUpperAction .contentViewPageSelectorDesc {
  display: inline;
  vertical-align: top;
}

.contentViewUpperAction .langSelect {
  font-size: .8em;
  margin: 0;
  min-width: auto;
  padding: 0;
}

.contentViewUpperAction .contentViewPageSelector {
  float: left;
  font-size: .8em;
  padding: .1em;
}

// =Actionbar in Home
.actionList {
  display: inline-block;
  list-style: none;
  margin: 0;
  padding: 0;
}

.actionList li {
  cursor: pointer;
  display: block;
  font-weight: normal;
  margin: 0 0 0 .4em;
  position: relative;
  text-decoration: none;
  z-index: 1040;
}

.actionList li a {
  color: $font-color;
  padding: 0;
}

.actionList .actionSubList {
  background-color: $shade-light-0;
  border-radius: $common-radius;
  box-shadow: 0 1px 4px rgba(0, 0, 0, .3);
  display: none;
  list-style: none;
  padding: 0;
  position: absolute;
  right: -1px;
  top: 28px;
  width: 250px;
  z-index: 1001;
}

.actionList .actionSubList li a {
  background: none;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  display: block;
  font-weight: normal;
  letter-spacing: inherit;
  line-height: initial;
  margin: 0;
  padding: .8em 1em;
  text-align: left;
  text-decoration: none;
  text-transform: none;
  white-space: normal;
  transition: all .15s ease 0s;
}

.actionList .actionSubList li a:hover {
  background-color: $shade-light-10;
  box-shadow: none;
}

.actionSubList .smallIcon {
  margin: 0 .8em -.2em 0;
}

.horizontalAction ~ .actionList li {
  background-color: transparent;
  border: 1px solid transparent;
  border-radius: $common-radius;
  color: $font-color;
  font-weight: bold;
  margin: 0;
}

.globalActions .horizontalAction .button {
  background:  none;
  border: 1px solid transparent;
  border-radius: $common-radius;
  height: auto;
  margin: 0;
  padding: 0 1em;
}

// =Kept for social collab custom actions
.headerTitleAndTools h1 {
  display: inline;
}

.headerTitleAndTools h1 span {
  color: $shade-light-20;
  font-weight: normal;
}

.headerTitleAndTools .globalActionBar {
  float: right;
}

.globalActionBar h1 {
  float: left;
}

.globalActionBar .actionList {
  float: right;
  list-style: none;
  margin: 0;
  padding: 0;
}

.globalActionBar .actionList li {
  cursor: pointer;
  display: block;
  font-weight: normal;
  height: auto;
  line-height: 130%;
  margin: 0 0 0 .4em;
  position: relative;
  text-decoration: none;
  z-index: 1040;
}

.globalActionBar .actionList li a {
  color: $font-color;
  padding: 0;
}

.globalActionBar .actionList .actionSubList {
  background-color: $shade-light-0;
  border-radius: $common-radius;
  box-shadow: 0 1px 4px rgba(0, 0, 0, .3);
  display: none;
  list-style: none;
  margin-top: .5em;
  padding: 0;
  position: absolute;
  right: 0;
  top: 19px;
  width: 250px;
  z-index: 1001;
}

.actionList .actionSubList li,
.globalActionBar .actionList .actionSubList li {
  background: none;
  border: 0;
  float: none;
  height: auto;
  margin: 0;
  max-width: 300px;
  padding: 0;
  text-align: left;
}

.globalActionBar .actionList .actionSubList li a {
  background: none;
  border: 0;
  display: block;
  margin: 0;
  padding: .8em 1em;
  text-decoration: none;
  white-space: normal;
  transition: all .15s ease 0s;
}

.globalActionBar .actionList .actionSubList li a:hover {
  background-color: $shade-light-10;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.globalActionBar .actionSubList .smallIcon {
  margin: 0 .8em -.2em 0;
}

.separator {
  border-bottom: 1px solid $shade-light-50;
}

// =MainActions in Document Title Area
.titleBlock {
  float: left;
  max-width: 50em;
}

.globalActions {
  float: right;
}

.globalActions > span, .globalActions .horizontalAction {
  float: left;
}

.contextActions {
  padding: .4em 0 .5em;
}

.contextActions div img {
  padding: -.3em 0 0;
}

// Actions in left column
.column .action_bar {
  float: none;
  margin: 0 0 1.5em;
}

.column .widgetPanel .horizontalAction .button,
.column .widgetPanel .horizontalAction:only-child,
.column .widgetPanel .horizontalAction:only-child form {
  display: block;
}

.nx-page .column .importButton {
  background: url('${basePath}/icons/import.png') no-repeat scroll 29% center / 25px 25px;
  background-color: $button-import;
  border: 0;
  border-radius: $common-radius;
  box-shadow: none;
  color: $shade-light-0;
  cursor: pointer;
  height: auto;
  margin: .5em 0 0;
  text-transform: uppercase;
  width: 100%;
}

.nx-page .column .importButton:hover {
  background: url('${basePath}/icons/import.png') no-repeat scroll 29% center / 25px 25px;
  background-color: $button-import;
  border: 0;
  box-shadow: 0 -30px 20px rgba(255, 255, 255, .2) inset;
}

// Link on forms
.actionLink {
  margin: .1em .2em .1em .1em;
}

// =Foldablebox Action for Local Configuration
.foldableBox h3 a.action,
.foldableBox h3 a.action:visited {
  color: $font-color;
  float: right;
  font-size: .8em;
  margin: -.2em 0 0 1em;
}

.foldableBox h3 a.action:hover,
.foldableBox h3 a.action:visited:hover {
  float: right !important;
}

// =RightClick menu
#contextMenu {
  border-radius: $common-radius;
  left: 0;
  position: absolute;
  top: 0;
  visibility: hidden;
}

.ctxMenuStyle {
  box-shadow: 0 1px 4px rgba(0, 0, 0, .3);
  font-size: .7em;
  min-width: 120px;
}

.ctxMenuItemStyle,
.ctxMenuItemHoverStyle {
  background-color: $shade-light-0;
  cursor: default;
  display: block;
  font-weight: bold;
  margin: 0;
  padding: .4em .5em;
  transition: all .15s ease 0s;
}

.ctxMenuItemHoverStyle {
  background-color: $shade-light-10;
  cursor: pointer;
}

.ctxMenuItemStyle a,
.ctxMenuItemHoverStyle a {
  display: block;
  text-decoration: none;
}

.ctxMenuImg {
  padding: 0 .4em .2em 0;
  vertical-align: middle;
}

// =Labels, tags, users
.tag {
  background: none $shade-light-20;
  border-radius: 16px;
  color: #333;
  display: inline-block;
  font-size: 13px !important;
  line-height: inherit;
  margin: 0 .3em .5em 0;
  padding: .1em .8em .2em;
  text-decoration: none;
  transition: none;
}

.tag,
a.tag,
.tag a,
.tagLink a {
  color: $shade-strong-30 !important;
  text-decoration: none;
}

.tagLink img {
  display: inline;
  height: 12px;
  margin: 0 0 -.1em;
  opacity: .7;
  width: 12px;
}

a.tag:hover,
.tag a:hover,
.tag img:hover {
  background-color: $shade-light-30;
  opacity: 1;
}

.tag.newTag {
  background: url('${basePath}/icons/add.png') no-repeat scroll 0 0 $success-background;
  color: $font-color;
  padding: 0 .3em 0 1.3em;
}

.user,
.group,
span.user,
span.group {
  background: url('${basePath}/icons/user.png') no-repeat scroll 7px 6px / 13px $shade-light-20;
  border-radius: 16px;
  color: $shade-strong-20;
  display: inline-block;
  font-size: .95em;
  line-height: 1.7em;
  margin: 0 .2em .2em 0;
  padding: .1em .7em .1em 2em;
  white-space: nowrap;
}

.group,
span.group {
  background: url('${basePath}/icons/group.png') no-repeat scroll 7px 6px /13px $shade-light-20;
}

.user a:hover,
.group a:hover {
  color: $link-hover;
  text-decoration: none;
}

a .user:hover,
a .group:hover {
  background-color: $shade-light-50;
  border-color: $shade-medium-10;
}

.description_block span.user {
  display: inline-block;
  font-size: 1em;
  padding: .1em .3em .1em 2.1em;
}

.sticker {
  background-color: $shade-light-30;
  border-radius: $common-radius;
  color: $info-label;
  display: inline-block;
  font-size: .95em;
  font-weight: bold;
  margin: .2em .5em .2em 0;
  padding: .1em .6em;
}

// =Icon size management for upload in Nuxeo Studio
.bigIcon {
  width: 50px;
}

.smallIcon {
  height: 16px;
  width: 16px;
}
